<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
	<style type='text/css'>
	.circleBase {
		-webkit-border-radius: 999px;
		-moz-border-radius: 999px;
		border-radius: 999px;
		behavior: url(PIE.htc);
	}

	.type1 {
		width: 50px;
		height: 50px;
		border: 1px solid black
	}
	.type2 {
		width: 50px;
		height: 50px;
		background: #ccc;
		border: 3px solid #000
	}
	.type3 {
		width: 500px;
		height: 500px;
		background: aqua;
		border: 30px solid blue
	}
  </style>
  <script type="text/javascript">
			function onHitMe() {
				var array = document.getElementById("name1").value + "|" +
				        document.getElementById("old1").value + "|" +
						document.getElementById("name2").value + "|"+
				        document.getElementById("old2").value;
				Android.onHitMe(array);
			}
			function setName1(name) {
				document.getElementById("name1").value = name;
			}
			function setName2(name) {
				document.getElementById("name2").value = name;
			}
			function setOld1(old) {
				document.getElementById("old1").value = old;
			}
			function setOld2(old) {
				document.getElementById("old2").value = old;
			}
			
		</script>
  
</HEAD>
<BODY LANG="en-US" DIR="LTR">
<TABLE WIDTH=60% BORDER=0 CELLPADDING=0 CELLSPACING=0 >
	<TR VALIGN=TOP>
		<TD WIDTH=10%>
			Name
		</TD>
		<TD WIDTH=20%>
			<input type="text" value="Dung Ho" id="name1" />
		</TD>
		<TD WIDTH=10%>
			Old
		</TD>
		<TD WIDTH=20%>
			<input type="text" value="33" id="old1" />
		</TD>
	</TR>
	<TR VALIGN=TOP>
		<TD WIDTH=10%>
		</TD>
		<TD WIDTH=20%>
			<input type="text" value="Soc Nhi" id="name2" />
		</TD>
		<TD WIDTH=10%>
		</TD>
		<TD WIDTH=20%>
		<input type="text" value="2" id="old2" />
		</TD>
	</TR>
</TABLE>
<input type="button" value="Hit Me" onclick="onHitMe();" />
<DIV ALIGN=CENTER style="position: fixed;top: 50%;left: 50%;"><div class="circleBase type1"></div></DIV>
</BODY>
</HTML>